<template>

  <a-card>
    <a-button
      style="margin-bottom:10px"
      type="primary"
      @click="handleAddAddress"
    >新增类目</a-button>
    <s-table
      ref="table"
      size="default"
      rowKey="id"
      :columns="columns"
      :data="loadData"
      showPagination="auto"
    >
      <span
        slot="action"
        slot-scope="text, record"
      >
        <template>
          <a @click="openEdit(record)">编辑</a>
          <a-divider type="vertical" />
          <a @click="goDelete(record)">删除</a>
          <a-divider type="vertical" />
        </template>
      </span>

    </s-table>
    <edit-mail
      @onSuccess="onEditMailSuccess"
      ref="editMail" />
    <add-mail
      @onSuccess="onAddMailSuccess"
      ref="addMail" />

  </a-card>
</template>


<script>
import { STable, Ellipsis } from '@/components'
import { queryInvoiceType, deleteInvoiceType } from '@/api/manage'
import editMail from './editMail'
import addMail from './addMail'
export default {
  name: 'Email',
  components: {
    STable,
    Ellipsis,
    editMail,
    addMail
  },
  data() {
    return {
      // 查询参数
      queryParam: {},
      // 表头
      columns: [
        // {
        //   title: '#',
        //   scopedSlots: { customRender: 'serial' }
        // },
        {
          title: '服务类型',
          dataIndex: 'serviceType'
        },
        {
          title: '具体服务内容',
          dataIndex: 'content',

        },
        {
          title: '开票类目',
          dataIndex: 'invoiceCategory'
          // sorter: true
          // needTotal: true,
          // customRender: (text) => text + ' 次'
        },

        {
          title: '操作',
          dataIndex: 'action',
          // width: '150px',
          scopedSlots: { customRender: 'action' }
        }
      ],
      // 加载数据方法 必须为 Promise 对象
      loadData: parameter => {
        console.log('loadData.parameter', parameter)
        return queryInvoiceType(Object.assign(parameter, this.queryParam)).then(res => {
          return res.resData
        })
      },
    }
  },
  methods: {
    handleAddAddress() {
      this.$refs.addMail.visible = true
      this.$refs.table.refresh()
      //   if (this.invoiceAddressListTotal >= 20) {
      //     this.$message.error('最多保存20条邮寄地址，您已达到上线')
      //     return
      //   }
      //   this.dialogVisible = true
    },
    goDelete(record) {
      console.log(record.id)
      deleteInvoiceType(record.id).then(res => {
        this.$message.success('删除成功')
        this.$refs.table.refresh()
      })
    },
    openEdit(record) {
      this.$refs.editMail.show(record)
    },
    onEditMailSuccess(){
      this.$message.success('编辑类目成功')
      this.$refs.table.refresh()
    },
    onAddMailSuccess(){
      this.$message.success('新增类目成功')
      this.$refs.table.refresh()
    }
  }
}
</script>
